<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/view/common/taglibs.jsp"%>
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
<title>${appname}</title>
<%@ include file="/WEB-INF/view/common/css_js_base.jsp"%>
<script>
$(function(){
});
</script>
</head>
<body>
<!-- Begin page content -->
<div class="container">
	<div class="panel panel-primary">
	  <div class="panel-heading">
	    <h3 class="panel-title">控制台</h3>
	  </div>
	  <div class="panel-body">
	  		默认按钮：
		   	<a href="#" class="btn btn-default">btn-default</a>
		   	<a href="#" class="btn btn-primary">btn-primary</a>
		   	<a href="#" class="btn btn-info">btn-info</a>
		   	<a href="#" class="btn btn-warning">btn-warning</a>
		   	<a href="#" class="btn btn-danger">btn-danger</a>
		   	<hr/>
	  		按钮大小：
		   	<a href="#" class="btn btn-primary btn-lg">btn-lg</a>
		   	<a href="#" class="btn btn-primary">btn-default</a>
		   	<a href="#" class="btn btn-primary btn-sm">btn-sm</a>
		   	<a href="#" class="btn btn-primary btn-xs">btn-xs</a>
		   	<hr/>
		   	行级别的按钮
		   	<div class="well">
			   	<button type="button" class="btn btn-primary btn-lg btn-block">Block level button</button>
				<button type="button" class="btn btn-default btn-lg btn-block">Block level button</button>
			</div>
			
			<hr/>
			button类型的active按钮
			<button type="button" class="btn btn-primary btn-lg active">Primary button</button>
			<button type="button" class="btn btn-default btn-lg active">Button</button>
			<hr/>
			a标记的active按钮
			<a href="#" class="btn btn-primary btn-lg active" role="button">Primary link</a>
			<a href="#" class="btn btn-default btn-lg active" role="button">Link</a>
			
			<hr/>
			失效的disabled按钮
			<button type="button" class="btn btn-lg btn-primary" disabled="disabled">Primary button</button>
			<button type="button" class="btn btn-default btn-lg" disabled="disabled">Button</button>
			<hr/>
			失效的a标记
			<a href="#" class="btn btn-primary btn-lg disabled" role="button">Primary link</a>
			<a href="#" class="btn btn-default btn-lg disabled" role="button">Link</a>
	  </div>
	</div>
	
	
	<div class="panel panel-primary">
	  <div class="panel-heading">
	    <h3 class="panel-title">Button-group</h3>
	  </div>
	  <div class="panel-body">
	  	<div class="btn-group">
		  <button type="button" class="btn btn-default">Left</button>
		  <button type="button" class="btn btn-default">Middle</button>
		  <button type="button" class="btn btn-default">Right</button>
		</div>
	  </div>
	</div>
	
	
	<div class="panel panel-primary">
	  <div class="panel-heading">
	    <h3 class="panel-title"><h3 id="btn-groups-toolbar">Button toolbar</h3></h3>
	  </div>
	  <div class="panel-body">
		 <div class="btn-toolbar" role="toolbar" style="margin: 0;">
		      <div class="btn-group">
		        <button type="button" class="btn btn-default">1</button>
		        <button type="button" class="btn btn-default">2</button>
		        <button type="button" class="btn btn-default">3</button>
		        <button type="button" class="btn btn-default">4</button>
		      </div>
		      <div class="btn-group">
		        <button type="button" class="btn btn-default">5</button>
		        <button type="button" class="btn btn-default">6</button>
		        <button type="button" class="btn btn-default">7</button>
		      </div>
		      <div class="btn-group">
		        <button type="button" class="btn btn-default">8</button>
		      </div>
		    </div>
	  </div>
	</div>
	
	
	<div class="panel panel-primary">
	  <div class="panel-heading">
	    <h3 class="panel-title"> <h3 id="btn-groups-sizing">Sizing</h3></h3>
	  </div>
	  <div class="panel-body">
		 	<div class="btn-toolbar" role="toolbar">
		      <div class="btn-group btn-group-lg">
		        <button type="button" class="btn btn-default">Left</button>
		        <button type="button" class="btn btn-default">Middle</button>
		        <button type="button" class="btn btn-default">Right</button>
		      </div>
		    </div>
		    <div class="btn-toolbar" role="toolbar">
		      <div class="btn-group">
		        <button type="button" class="btn btn-default">Left</button>
		        <button type="button" class="btn btn-default">Middle</button>
		        <button type="button" class="btn btn-default">Right</button>
		      </div>
		    </div>
		    <div class="btn-toolbar" role="toolbar">
		      <div class="btn-group btn-group-sm">
		        <button type="button" class="btn btn-default">Left</button>
		        <button type="button" class="btn btn-default">Middle</button>
		        <button type="button" class="btn btn-default">Right</button>
		      </div>
		    </div>
		    <div class="btn-toolbar" role="toolbar">
		      <div class="btn-group btn-group-xs">
		        <button type="button" class="btn btn-default">Left</button>
		        <button type="button" class="btn btn-default">Middle</button>
		        <button type="button" class="btn btn-default">Right</button>
		      </div>
		    </div>
	  </div>
	</div>
	
	
	
	<div class="panel panel-primary">
	  <div class="panel-heading">
	    <h3 class="panel-title"> <h3 id="btn-groups-sizing">nesting</h3></h3>
	  </div>
	  <div class="panel-body">
			<div class="btn-group">
			  <button type="button" class="btn btn-default">1</button>
			  <button type="button" class="btn btn-default">2</button>
			
			  <div class="btn-group">
			    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
			      Dropdown
			      <span class="caret"></span>
			    </button>
			    <ul class="dropdown-menu">
			      <li><a href="#">Dropdown link</a></li>
			      <li><a href="#">Dropdown link</a></li>
			    </ul>
			  </div>
			</div>
	  </div>
	</div>
	
	
	
	<div class="panel panel-primary">
	  <div class="panel-heading">
	    <h3 class="panel-title"> Single button dropdowns </h3>
	  </div>
	  <div class="panel-body">
		<div class="btn-group">
		      <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Default <span class="caret"></span></button>
		      <ul class="dropdown-menu" role="menu">
		        <li><a href="#">Action</a></li>
		        <li><a href="#">Another action</a></li>
		        <li><a href="#">Something else here</a></li>
		        <li class="divider"></li>
		        <li><a href="#">Separated link</a></li>
		      </ul>
		    </div><!-- /btn-group -->
		    <div class="btn-group">
		      <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">Primary <span class="caret"></span></button>
		      <ul class="dropdown-menu" role="menu">
		        <li><a href="#">Action</a></li>
		        <li><a href="#">Another action</a></li>
		        <li><a href="#">Something else here</a></li>
		        <li class="divider"></li>
		        <li><a href="#">Separated link</a></li>
		      </ul>
		    </div><!-- /btn-group -->
		    <div class="btn-group">
		      <button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown">Success <span class="caret"></span></button>
		      <ul class="dropdown-menu" role="menu">
		        <li><a href="#">Action</a></li>
		        <li><a href="#">Another action</a></li>
		        <li><a href="#">Something else here</a></li>
		        <li class="divider"></li>
		        <li><a href="#">Separated link</a></li>
		      </ul>
		    </div><!-- /btn-group -->
		    <div class="btn-group">
		      <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown">Info <span class="caret"></span></button>
		      <ul class="dropdown-menu" role="menu">
		        <li><a href="#">Action</a></li>
		        <li><a href="#">Another action</a></li>
		        <li><a href="#">Something else here</a></li>
		        <li class="divider"></li>
		        <li><a href="#">Separated link</a></li>
		      </ul>
		    </div><!-- /btn-group -->
		    <div class="btn-group">
		      <button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown">Warning <span class="caret"></span></button>
		      <ul class="dropdown-menu" role="menu">
		        <li><a href="#">Action</a></li>
		        <li><a href="#">Another action</a></li>
		        <li><a href="#">Something else here</a></li>
		        <li class="divider"></li>
		        <li><a href="#">Separated link</a></li>
		      </ul>
		    </div><!-- /btn-group -->
		    <div class="btn-group">
		      <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown">Danger <span class="caret"></span></button>
		      <ul class="dropdown-menu" role="menu">
		        <li><a href="#">Action</a></li>
		        <li><a href="#">Another action</a></li>
		        <li><a href="#">Something else here</a></li>
		        <li class="divider"></li>
		        <li><a href="#">Separated link</a></li>
		      </ul>
		    </div><!-- /btn-group -->
	  </div>
	</div>
	
	<hr/>
	<div class="panel panel-primary">
	  <div class="panel-heading">
	    <h3 class="panel-title"> <h3 id="btn-groups-sizing">Split button dropdowns</h3></h3>
	  </div>
	  <div class="panel-body">
		    <div class="btn-group">
		      <button type="button" class="btn btn-default">Default</button>
		      <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
		        <span class="caret"></span>
		        <span class="sr-only">Toggle Dropdown</span>
		      </button>
		      <ul class="dropdown-menu" role="menu">
		        <li><a href="#">Action</a></li>
		        <li><a href="#">Another action</a></li>
		        <li><a href="#">Something else here</a></li>
		        <li class="divider"></li>
		        <li><a href="#">Separated link</a></li>
		      </ul>
		    </div><!-- /btn-group -->
		    <div class="btn-group">
		      <button type="button" class="btn btn-primary">Primary</button>
		      <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
		        <span class="caret"></span>
		        <span class="sr-only">Toggle Dropdown</span>
		      </button>
		      <ul class="dropdown-menu" role="menu">
		        <li><a href="#">Action</a></li>
		        <li><a href="#">Another action</a></li>
		        <li><a href="#">Something else here</a></li>
		        <li class="divider"></li>
		        <li><a href="#">Separated link</a></li>
		      </ul>
		    </div><!-- /btn-group -->
		    <div class="btn-group">
		      <button type="button" class="btn btn-success">Success</button>
		      <button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown">
		        <span class="caret"></span>
		        <span class="sr-only">Toggle Dropdown</span>
		      </button>
		      <ul class="dropdown-menu" role="menu">
		        <li><a href="#">Action</a></li>
		        <li><a href="#">Another action</a></li>
		        <li><a href="#">Something else here</a></li>
		        <li class="divider"></li>
		        <li><a href="#">Separated link</a></li>
		      </ul>
		    </div><!-- /btn-group -->
		    <div class="btn-group">
		      <button type="button" class="btn btn-info">Info</button>
		      <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown">
		        <span class="caret"></span>
		        <span class="sr-only">Toggle Dropdown</span>
		      </button>
		      <ul class="dropdown-menu" role="menu">
		        <li><a href="#">Action</a></li>
		        <li><a href="#">Another action</a></li>
		        <li><a href="#">Something else here</a></li>
		        <li class="divider"></li>
		        <li><a href="#">Separated link</a></li>
		      </ul>
		    </div><!-- /btn-group -->
		    <div class="btn-group">
		      <button type="button" class="btn btn-warning">Warning</button>
		      <button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown">
		        <span class="caret"></span>
		        <span class="sr-only">Toggle Dropdown</span>
		      </button>
		      <ul class="dropdown-menu" role="menu">
		        <li><a href="#">Action</a></li>
		        <li><a href="#">Another action</a></li>
		        <li><a href="#">Something else here</a></li>
		        <li class="divider"></li>
		        <li><a href="#">Separated link</a></li>
		      </ul>
		    </div><!-- /btn-group -->
		    <div class="btn-group">
		      <button type="button" class="btn btn-danger">Danger</button>
		      <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown">
		        <span class="caret"></span>
		        <span class="sr-only">Toggle Dropdown</span>
		      </button>
		      <ul class="dropdown-menu" role="menu">
		        <li><a href="#">Action</a></li>
		        <li><a href="#">Another action</a></li>
		        <li><a href="#">Something else here</a></li>
		        <li class="divider"></li>
		        <li><a href="#">Separated link</a></li>
		      </ul>
		    </div><!-- /btn-group -->
	  </div>
	</div>
	
	<div class="panel panel-primary">
	  <div class="panel-heading">
	    Dropup variation
	  </div>
	  <div class="panel-body">
			<div class="btn-toolbar" role="toolbar">
		      <div class="btn-group dropup">
		        <button type="button" class="btn btn-default">Dropup</button>
		        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
		          <span class="caret"></span>
		          <span class="sr-only">Toggle Dropdown</span>
		        </button>
		        <ul class="dropdown-menu" role="menu">
		          <li><a href="#">Action</a></li>
		          <li><a href="#">Another action</a></li>
		          <li><a href="#">Something else here</a></li>
		          <li class="divider"></li>
		          <li><a href="#">Separated link</a></li>
		        </ul>
		      </div><!-- /btn-group -->
		      <div class="btn-group dropup">
		        <button type="button" class="btn btn-primary">Right dropup</button>
		        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
		          <span class="caret"></span>
		          <span class="sr-only">Toggle Dropdown</span>
		        </button>
		        <ul class="dropdown-menu pull-right" role="menu">
		          <li><a href="#">Action</a></li>
		          <li><a href="#">Another action</a></li>
		          <li><a href="#">Something else here</a></li>
		          <li class="divider"></li>
		          <li><a href="#">Separated link</a></li>
		        </ul>
		      </div><!-- /btn-group -->
	  </div>
	</div>
</div>
<%@ include file="/WEB-INF/view/common/footer.jsp"%>
</body>
</html>
